<template>
	<view class="">
		<!-- 顶部导航 -->
		<view class="img-wrap">
			<u-image src="https://www.mopkeji.com/uploads/mini/RD.jpg" mode="widthFix"></u-image>
		</view>
		<view class="uni-form-item uni-column">
			<!-- <view class="title margin">*账号*</view> -->
			<view class="input-wrap">
				<view class="prefix">
					<u-icon name="account" size="32"></u-icon>账号：
				</view>
				<input v-model="form.account" class="uni-input" placeholder="请输入您的账号" />
			</view>
			<!-- <view class="title margin">*密码*</view> -->
			<view class="input-wrap">
				<view class="prefix">
					<u-icon name="lock-open" size="32"></u-icon>密码：
				</view>
				<input type="password" v-model="form.password" class="uni-input" placeholder="请输入您的密码" />
			</view>
			<view class="button-wrap">
				<button class="send-btn margin" @click="goLogin()">登录</button>
			</view>
			<view class="button-wrap">
				<button class="register-btn margin" @click="register()">注册</button>
			</view>
		</view>
	</view>
</template>

<script>
import {loginfunc} from '@/common/fa.mixin.js'
export default {
	mixins:[loginfunc],
	onLoad() {
		// #ifdef MP-WEIXIN || APP-PLUS
		// this.isThreeLogin = true;
		// #endif

		// #ifdef H5
		// if (this.$util.isWeiXinBrowser()) {
		// 	this.isThreeLogin = true;
		// }
		// #endif
	},
	// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
	onReady() {
		// this.$refs.uForm.setRules(this.rules);
	},
	data() {
		return {
			// labelPosition: 'top',
			// border: false,
			// errorType: ['message'],
			form: {
				account: '',
				password: ''
			},
			// rules: {
			// 	account: [
			// 		{
			// 			required: true,
			// 			message: '请输入账号',
			// 			// 可以单个或者同时写两个触发验证方式
			// 			trigger: ['change', 'blur']
			// 		}
			// 	],
			// 	password: [
			// 		{
			// 			required: true,
			// 			message: '请输入密码',
			// 			trigger: 'change'
			// 		}
			// 	]
			// },
			isThreeLogin: false
		};
	},
	methods: {
		goThreeLogin: async function() {
			// #ifdef MP-WEIXIN
			// this.$Router.push('/pages/login/wxlogin');
			uni.navigateTo({
				url:'/pages/login/wxlogin'
			})
			// #endif

			// // #ifdef H5

			// if (this.$util.isWeiXinBrowser()) {
			// 	let res = await this.$api.getAuthUrl({
			// 		platform: 'wechat',
			// 		url: window.location.origin + '/pages/login/auth'
			// 	});
			// 	if (!res.code) {
			// 		this.$u.toast(res.msg);
			// 		return;
			// 	}
			// 	window.location.href = res.data;
			// }
			// // #endif

			// // #ifdef APP-PLUS
			// let that = this;
			// var all, Service;
			// // 1.发送请求获取code
			// plus.oauth.getServices(
			// 	function(Services) {
			// 		all = Services;
			// 		Object.keys(all).some(key => {
			// 			if (all[key].id == 'weixin') {
			// 				Service = all[key];
			// 			}
			// 		});
			// 		Service.authorize(
			// 			async function(e) {
			// 				console.log(e);
			// 				let res = await that.$api.goAppLogin({ code: e.code, scope: e.scope });
			// 				if (!res.code) {
			// 					that.$u.toast(res.msg);
			// 					return;
			// 				}
			// 				if (res.data.user) {
			// 					that.$u.vuex('vuex_token', res.data.user.token);
			// 					that.success(2);
			// 					return;
			// 				}
			// 				that.$u.vuex('vuex_third', res.data.third);
			// 				that.$Router.push({path:'/pages/login/register',query:{bind:'bind'}});
			// 			},
			// 			function(e) {
			// 				that.$u.toast('授权失败！');
			// 			}
			// 		);
			// 	},
			// 	function(err) {
			// 		console.log(err);
			// 		that.$u.toast('授权失败！');
			// 	}
			);
			// #endif
		},
		goLogin: async function() {
			if (this.vuex_wx_uid) {
				this.form.wx_user_id = this.vuex_wx_uid;
			}
			let res = await this.$api.goLogin(this.form);
			if (!res.code) {
				uni.showToast({
					icon:'none',
					title:res.msg
				})
				return;
			}
			this.$u.vuex('vuex_token', res.data.token);
			this.success(2);
		},
		register: function(){
			uni.navigateTo({
				url: '/pages/login/register'
			})
		}
	}
};
</script>

<style lang="scss">
/* page {
	background-color: #ffffff;
} */
.uni-column {
	display: flex;
    align-items: center;
    flex-direction: column;
}
.img-wrap {
	margin-bottom: 60rpx;
}
.input-wrap {
	font-size: 32rpx;
	display: flex;
	margin: 30rpx;
    padding: 30rpx;
	background-color: #fff;
	border-radius: 20rpx;
	.u-icon {
		margin-right: 10rpx;
	}
	.prefix {
		color: gray;
	}
}
.username,.email,.mobile,.message{
		border: 2upx solid grey;
	}
.user-form{
	margin-left: 30upx;
	margin-right: 50upx;
}
.msg-area{
	height: 300upx;
}
.button-wrap {
	width: 350rpx;
	margin-top: 30rpx;
	.send-btn {
		font-size: 32rpx;
		padding: 10rpx;
		/* margin-top: 50upx; */
		/* margin-left: 50upx; */
		background-color: #203864;
		color: white;
		// font-weight: bold;
		// float:right;
	}
	.register-btn {
		font-size: 32rpx;
		padding: 10rpx;
		/* margin-top: 50upx; */
		/* margin-left: 50upx; */
		background-color: #a1a1a1;
		color: white;
		// font-weight: bold;
		// float:right;
	}
}
</style>
